/*
 * @Author: SamZhang SamZhang@apjcorp.com
 * @Date: 2022-07-13 10:32:27
 * @LastEditors: SamZhang SamZhang@apjcorp.com
 * @LastEditTime: 2022-11-12 14:53:08
 * @FilePath: /circulation-web/src/components/EntryPointsTabs.tsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
import * as React from "react";
import CatalogLink from "opds-web-client/lib/components/CatalogLink";
import { FacetData } from "../my_modules/opds-web-client/lib/interfaces";
import * as PropTypes from "prop-types";
import { PathFor } from "../interfaces";
import { AudioHeadphoneIcon, BookIcon, EReaderIcon } from "@nypl/dgx-svg-icons";

export interface EntryPointsTabsContext {
  pathFor: PathFor;
  router: any;
}
export interface EntryPointsTabsProps {
  facets?: FacetData[];
}

/** This component renders a library's entrypoints as linked tabs. */
export class EntryPointsTabs extends React.Component<EntryPointsTabsProps, {}> {
  context: EntryPointsTabsContext;

  constructor(props) {
    super(props);
  }

  static contextTypes: React.ValidationMap<EntryPointsTabsContext> = {
    router: PropTypes.object.isRequired,
    pathFor: PropTypes.func.isRequired,
  };

  render(): JSX.Element {
    //检查当前url参数是否包含 "hiddenBooks"
    if (window.location.href.includes("hiddenBooks")) {
      return null;
    }

    const entryPoints = this.props.facets ? this.props.facets : [];
    if (!entryPoints.length) {
      return null;
    }

    const mapEntryPointsToSchema = {
      All: "http://schema.org/CreativeWork",
      eBooks: "http://schema.org/EBook",
      Audiobooks: "http://bib.schema.org/Audiobook",
      Magazines: "http://schema.org/Magazine",
    };
    const svgMediumTypes = {
      "http://bib.schema.org/Audiobook": (
        <AudioHeadphoneIcon ariaHidden title="Audio Headphones Icon" />
      ),
      "http://schema.org/EBook": <BookIcon ariaHidden title="Book Icon" />,
      // "http://schema.org/Magazine": <MagazineIcon ariaHidden title="Magazine Icon" />,
      "http://schema.org/Magazine": (
        <EReaderIcon ariaHidden title="Magazine Icon" />
      ),
      "http://schema.org/CreativeWork": null,
    };

    return (
      <ul className="nav nav-tabs entry-points-list">
        {entryPoints.map((entryPoint) => {
          const label = entryPoint.label;
          const value = mapEntryPointsToSchema[label];
          const activeClass = entryPoint.active ? "active" : "";
          const url = entryPoint.href;
          const svg = svgMediumTypes[value] ? svgMediumTypes[value] : null;
          const noSVGClass = !svg ? "no-svg" : "";

          return (
            <li
              key={label}
              role="presentation"
              className={`${activeClass} ${noSVGClass}`}
            >
              <CatalogLink collectionUrl={url} bookUrl={null}>
                {svg}
                {label}
              </CatalogLink>
            </li>
          );
        })}
      </ul>
    );
  }
}

export default EntryPointsTabs;
